<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>
<script>

  function Person(params) {
    this.name = params;
    // this.instance = null; 开闭规则
  }

  Person.prototype.setName = function (name) {
    this.name = name;
  };

  Person.prototype.getName = function () {
    return this.name;
  };

  // Person.getInstance = function (params) {
  //   // 有实例 返回当前的实例
  //   // 如果没有 创建一个
  //   this.instance = this.instance ? this.instance : new Person(params);
  //   return this.instance
  // };

  Person.getInstance = (function () {
    let instance = null;
    return function (name) {
      if (!instance) {
        instance = new Person(name);
      }
      return instance;
    };
  })();

  // 创建一个实例
  // 1. 减少内存浪费
  // 2. 减少代码冗余


  // createSingle(Person)
  // 不同通过构造传递参数  只能通过 set/get方法区处理参数

  // let person1 = Person.getInstance();
  // person1.setName('a');
  // console.log(person1.getName());
  // let person2 = Person.getInstance();
  // person2.setName('b');
  // console.log(person2.getName());
  // console.log(person1 === person2);

  function CreateSingle() {

  }

  const Animal = (function () {
    let instance = null;
    return function (name) {
      // instanceof 是否和 Animal 是 类和实例的关系
      instance = instance ? instance : new CreateSingle();
      instance.constructors(name);
      return instance;
    };
  })();

  CreateSingle.prototype.constructors = function (name) {
    this.name = name;
  };


  CreateSingle.prototype.getName = function () {
    return this.name;
  };

  // Vuex 创建一次实例 : 单例模式 : 单个实例
  let animal1 = new Animal('泰迪');
  console.log(animal1.getName());
  let animal2 = new Animal('金毛');
  animal2.getName();
  console.log(animal1.getName());
  console.log(animal1 === animal2);

  // 弹窗 按钮 按钮 按钮
  // const createLayer = createSingle(弹窗的类)
  // createLayer.set弹窗的属性
  // createLayer.open({width:'200px',height:'300px'})

</script>
</body>
</html>
